<script lang="ts" setup>
import MenuInfo from "./menu-info.vue"
import MenuSave from "./menu-save.vue"
</script>
<template>
  <div class="menu-info">
    <el-tabs type="border-card" style="overflow: hidden">
      <el-tab-pane style="overflow: hidden">
        <template v-slot:label>
          <span><i class="el-icon-date" />菜单详情</span>
        </template>
        <MenuInfo />
      </el-tab-pane>
      <el-tab-pane>
        <template v-slot:label>
          <span><i class="el-icon-date" />新增菜单</span>
        </template>
        <MenuSave />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<style lang="scss" scoped>
.menu-info {
  overflow: hidden;
  :deep(.el-tabs--border-card) {
    border: none !important;
  }
  :deep(.el-tabs) {
    .el-tabs__content {
      overflow: hidden;
    }
  }
}
</style>
